<template>
	<view class="classlist">
		<view class="loadingLayout" v-if="!classList.length && !noData">
			<uni-load-more status="loading"></uni-load-more>
		</view>

		<view class="content">
			<navigator :url="'/pages/preview/preview?id='+item._id" class="item" v-for="item in classList"
				:key="item._id">
				<image :src="item.smallPicurl" mode="aspectFill"></image>
			</navigator>
		</view>

		<view class="loadingLayout" v-if="classList.length || noData">
			<uni-load-more :status="noData ? 'noMore' : 'loading'"></uni-load-more>
		</view>

		<view class="safe-area-inset-bottom"></view>

	</view>
</template>

<script setup>
	import {
		onLoad,
		onUnload,
		onReachBottom,
		onPullDownRefresh,
		onShareAppMessage,
		onShareTimeline
	} from '@dcloudio/uni-app'

	import {
		gotoHome
	} from '@/utils/common.js'
	import {
		ref
	} from 'vue'
	import {
		getWallList,
		getUserWallList
	} from "@/api/apis.js"
	const classList = ref([])
	const noData = ref(false) //触底禁止发送请求


	//参数
	const queryParms = {
		pageNum: 1,
		pageSize: 12
	}
	let pageName;
	onLoad((e) => {
		let {
			id = null, name = null, type = null
		} = e;
		// if (!id) {
		// 	gotoHome()
		// }
		if (type) queryParms.type = type;
		if (id) queryParms.classid = id;

		pageName = name;
		uni.setNavigationBarTitle({
			title: name
		})
		getClassList()

	})

	//触底加载
	onReachBottom(() => {
		if (noData.value) return;
		queryParms.pageNum++;
		getClassList();

	})

	//下拉刷新
	onPullDownRefresh(() => {
		classList.value = [];
		getClassList();
		setTimeout(function() {
			uni.stopPullDownRefresh();
		}, 1000);
	})

	//获取分类列表
	const getClassList = async () => {
		let res;
		if (queryParms.classid) res = await getWallList(queryParms);
		if (queryParms.type) res = await getUserWallList(queryParms);
		classList.value = [...classList.value, ...res.data];
		if (queryParms.pageSize > res.data.length) noData.value = true;
		console.log(res.data)
		uni.setStorageSync("storgClassList", classList.value)
	}

	//分享好友
	onShareAppMessage((e) => {

		return {
			title: "Y壁纸" + pageName,
			path: "/pages/claaslist/claaslist?id=" + queryParms.classid + "&name" + pageName
		}
	})

	//分享朋友圈
	onShareTimeline(() => {
		return {
			title: "Y壁纸",
			query: "id=" + queryParms.classid + "&name" + pageName
		}
	})

	onUnload(() => {
		uni.removeStorageSync("storgClassList")
	})
</script>

<style lang="scss" scoped>
	.classlist {
		.content {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 5rpx;
			padding: 5rpx;

			.item {
				height: 440rpx;

				image {
					width: 100%;
					height: 100%;
					display: block; //块元素
				}
			}
		}
	}
</style>